<template>
  <div>
    <el-table
      :data="tableData"
      height="600"
      stripe
      border
      highlight-current-row
      style="width: 100%"
      v-loading="loading"
    >
      <el-table-column prop="p_id" label="实践序号" width="190">
      </el-table-column>
      <el-table-column prop="p_name" label="实践名称" width="190">
      </el-table-column>
      <el-table-column prop="address" label="实践地址" width="190">
      </el-table-column>
      <el-table-column prop="teacher.teacher_name" label="负责老师" width="190">
      </el-table-column>
      <el-table-column prop="start_time" label="起始时间" width="190">
      </el-table-column>
      <el-table-column prop="end_time" label="结束时间" width="190">
      </el-table-column>
      <el-table-column label="操作" width="125">
        <template slot-scope="scope">
          <el-button
            @click="deleteRow(scope.$index, tableData)"
            type="text"
            size="small"
            >移除</el-button
          >
        </template>
      </el-table-column>
    </el-table>
    <el-button
      type="warning"
      icon="el-icon-refresh-right"
      circle
      @click="refresh"
    ></el-button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      tableData: [],
      teacher:JSON.parse(sessionStorage.getItem('teacher')),
      loading:false
    };
  },
  created() {
      this.$axios.post('/api/teacher/selectpractice',this.$qs.stringify({t_id:this.teacher.t_id})).then(res=>{
            this.tableData=res.data;
    })
  },

  methods: {
    deleteRow(index, rows) {
      this.$axios
        .post(
          "/api/teacher/deletepractice",
          this.$qs.stringify({
            p_id: rows[index].p_id,
            t_id:this.teacher.t_id
          })
        )
        .then(() => {
          rows.splice(index, 1);
          this.$message.success("删除成功");
        })
        .catch(() => {
          this.$message.error("删除失败");
        });
    },
    refresh() {
        this.loading=true;
            setTimeout(()=>{
                this.loading=false;
            },1000)
        this.$axios.post('/api/teacher/selectpractice',this.$qs.stringify({t_id:this.teacher.t_id})).then(res=>{
            this.tableData=res.data;
        })
    }
  }
};
</script>

<style></style>
